import { Tabs } from 'antd';
import { useState } from 'react';
import TripManage from '../trip-manage';
import Management from './components/Management';
import styles from './index.less';

const Index = () => {
  const [selectedTab, setSelectedTab] = useState('1');
  const [detailParams, setDetailParams] = useState();
  const handleDetail = (params) => {
    setSelectedTab('2');
    setDetailParams(params);
  };
  const items = [
    {
      key: '1',
      label: '司机趟次统计',
      children: <Management onDetail={handleDetail} />,
    },
    {
      key: '2',
      label: '趟次明细',
      children: (
        <TripManage
          key={detailParams?.uuid}
          readonly
          initialValues={detailParams}
        />
      ),
    },
  ];
  return (
    <div className={styles.page}>
      <Tabs
        items={items}
        className="fit-tabs"
        activeKey={selectedTab}
        onChange={setSelectedTab}
      />
    </div>
  );
};

export default Index;
